<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	<script type="text/javascript">
		var __ctxPath="<%=request.getContextPath() %>";
	</script>
    <script src="${ctx}/resources/js/jquery/jquery-1.6.2.min.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/jquery/miniui/miniui.js" type="text/javascript"></script>
	<link href="${ctx}/resources/js/jquery/miniui/themes/default/miniui.css" rel="stylesheet" type="text/css" />
	<link href="${ctx}/resources/js/jquery/miniui/themes/icons.css" rel="stylesheet" type="text/css" />
	<link href="${ctx}/resources/css/os_x_dock.css" rel="stylesheet" type="text/css" />
	
	<script src="${ctx}/resources/js/desktop/DeskTop.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/Window.js" type="text/javascript"></script>
	<link href="${ctx}/resources/js/desktop/desktop.css" rel="stylesheet" type="text/css" />
	
	<!-- windows -->
	<script src="${ctx}/resources/js/desktop/windows/IFrameWindow.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/windows/GridWindow.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/windows/TabsWindow.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/windows/SplitterWindow.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/windows/MapWindow.js" type="text/javascript"></script>
	<script src="${ctx}/resources/js/desktop/windows/ChartWindow.js" type="text/javascript"></script>
	
	
  </head>
  
  <body>
  	
  </body>
  <!-- 放在body之后 -->
  <script type="text/javascript">
	    var modules = [
	        { name: "iframe", text: "User Manager", iconCls: "desk-window", title: "", type: "ux.iframewindow", url: __ctxPath+"/jsp.do?view=system/sys_user_list" },
	        { name: "simple", text: "Window", iconCls: "desk-window", title: "Window", type: "ux.window" },
	        { name: "iframe", text: "Role Manager", iconCls: "desk-window", title: "", type: "ux.iframewindow", url: __ctxPath+"/jsp.do?view=system/sys_role_list" },
	        { name: "grid", text: "用户管理", iconCls: "user-icon", title: "", type: "ux.gridwindow" },
	        { name: "splitter", text: "Splitter Window", iconCls: "desk-window", title: "", type: "ux.splitterwindow" },
	        { name: "tabs", text: "Tabs Window", iconCls: "desk-window", title: "", type: "ux.tabswindow" },        
	        { name: "map", text: "Map Window", iconCls: "desk-window", title: "", type: "ux.mapwindow" },
	        { name: "chart", text: "Chart Window", iconCls: "desk-window", title: "", type: "ux.chartwindow" }
	    ];
	    /////////////////////////////////////////////////
	
	    //desktop
	    var desk = new mini.ux.DeskTop();
	    desk.render(document.body);
	
	    //modules
	    desk.setModules(modules);
	
	    //module click
	    desk.on("moduleclick", function (e) {
	        var module = e.module;
	
	        var win = module.single;
	        if (!win) {
	            win = module.single = desk.createWindow(module.type);
	            if (win) {
	                if (win.type == "ux.iframewindow") {
	                    win.setUrl(module.url);
	                }
	            }
	        }
	        if (win) {
	            desk.showWindow(win);
	
	        }
	    });
	</script>
	
  	<div id="dockContainer">
		<div id="dockWrapper">
		
			<div class="cap left"></div>
			<ul class="osx-dock">
				<li class="active">
					<span>ZURB</span>
					<a href="http://www.zurb.com" title="ZURB"><img src="${ctx}/resources/images/index/zurb-icon.png" /></a>
				</li>
				<li>
					<span>LinkedIn</span>
					<a href="http://www.linkedin.com" title="LinkedIn"><img src="${ctx}/resources/images/index/linkedin-icon.png" /></a>
				</li>
				<li>
					<span>Notable</span>
					<a href="http://www.notableapp.com" title="Notable"><img src="${ctx}/resources/images/index/notable-icon.png" /></a>
				</li>
				<li>
					<span>last.fm</span>
					<a href="http://www.last.fm" title="Last.fm"><img src="${ctx}/resources/images/index/lastfm-icon.png" /></a>
				</li>
				<li>
					<span>Facebook</span>
					<a href="http://www.facebook.com" title="Facebook"><img src="${ctx}/resources/images/index/facebook-icon.png" /></a>
				</li>
				<li>
					<span>Google</span>
					<a href="http://www.google.com" title="Google"><img src="${ctx}/resources/images/index/google-icon.png" /></a>
				</li>
				<li>
					<span>Notable</span>
					<a href="http://www.notableapp.com" title="Notable"><img src="${ctx}/resources/images/index/notable-icon.png" /></a>
				</li>
				<li>
					<span>last.fm</span>
					<a href="http://www.last.fm" title="Last.fm"><img src="${ctx}/resources/images/index/lastfm-icon.png" /></a>
				</li>
				<li>
					<span>Facebook</span>
					<a href="http://www.facebook.com" title="Facebook"><img src="${ctx}/resources/images/index/facebook-icon.png" /></a>
				</li>
				<li>
					<span>Google</span>
					<a href="http://www.google.com" title="Google"><img src="${ctx}/resources/images/index/google-icon.png" /></a>
				</li>
			</ul>
		</div>
	</div>
</html>
